<!DOCTYPE html>
<html style="height: 100%">
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>患者360视图系统</title>
    <link href="/wwwroot/elementui/theme-chalk/index.css" rel="stylesheet"/>
    <link href="/wwwroot/Styles/base.css" rel="stylesheet"/>
    <link href="/wwwroot/Styles/ui-base.css" rel="stylesheet"/>
    <link href="/wwwroot/iconfont/iconfont.css?v=100" rel="stylesheet"/>
    <link href="/wwwroot/Styles/font-awesome-4.7.0/css/font-awesome.css" rel="stylesheet"/>
    <link href="/wwwroot/Styles/watermarkt.css" rel="stylesheet"/>
    <script src="/wwwroot/Vue/vue.min.js"></script>
    <script src="/wwwroot/Vue/vue-router.js"></script>
    <script src="/wwwroot/Vue/axios.min.js"></script>
    <script src="/wwwroot/Scripts/jquery-2.2.3.min.js"></script>
    <script src="/wwwroot/Scripts/base.js?dt=20201224"></script>
    <script src="/wwwroot/Scripts/xmlhelper.js"></script>
    <script src="/wwwroot/elementui/index.js?p=1"></script>
    <script src="/wwwroot/Scripts/echarts.min.js"></script>
    <script src="/wwwroot/Scripts/waterMark.js"></script>


    <style>
        .ulTable span {
            width: calc(50% - 20px) !important;
        }
    </style>
</head>
<body>
<div id="app" class="clinbrain-container checkInfo patient" v-loading.fullscreen.lock="loading"
     element-loading-text="正在加载数据..." element-loading-background="transparent" v-cloak>
    <div class="header">
        <el-form size="mini" :inline="true">
            <el-form-item label="请选择日期：">
                <el-date-picker type="daterange" v-model="requestModel.dates"
                                range-separator="~"
                                start-placeholder="开始日期"
                                value-format="yyyy-MM-dd"
                                end-placeholder="结束日期" style="margin-top:10px;">
                </el-date-picker>
            </el-form-item>
            <el-form-item>
                <el-checkbox v-model="requestModel.outpatientDepartment">门诊</el-checkbox>
                <el-checkbox v-model="requestModel.hospitalization">住院</el-checkbox>
                <i class="el-icon-search" v-on:click="search" style="cursor:pointer"></i>
            </el-form-item>
        </el-form>
    </div>
    <div class="checkinfo-container">
        <div class="checkinfo-content">
            <div class="left">
                <div class="clinbrain-card">
                    <div class="clinbrain-card-header">
                        <div class="title ulTable">
                            <span>申请日期</span>
                            <span>检查项目</span>
                        </div>
                    </div>
                    <div class="clinbrain-card-body">
                        <div class="com-not-data" v-if="isNotData">
                            暂无数据
                        </div>
                        <el-collapse accordion v-model="collapseValue" v-if="isNotData==false">
                            <el-collapse-item v-for="(item,index) in inspectReportData" :title="item.Title"
                                              :name="index">
                                <ul class="ulTable">
                                    <li :title="child|GetTitle" v-for="(child,cindex) in InspectionItemDetailAll"
                                        v-on:click="detailClick(child)">
                                        <span>{{child.VisitDate|dateFormat}}</span>
                                        <span>{{child.RequestItemName}}</span>
                                    </li>
                                </ul>
                            </el-collapse-item>
                        </el-collapse>
                    </div>
                </div>
            </div>
            <div id="rightDiv" class="right">
                <div class="clinbrain-card">
                    <div class="clinbrain-card-header"><span>检查报告详情</span></div>
                    <div class="clinbrain-card-body">
                        <div class="checkinfo-title-container">
                            <span>{{selectedItem.HospitalName}}</span>
                            <span>{{selectedItem.OBSMethodName}}</span>
                            <div class="checkinfo-button">
                                <span v-on:click="jumpVideo" style="cursor:pointer">影像预览</span>
                                <span v-if="HospitalConfig.Name == 'FSFY'" v-on:click="ReportVideo"
                                      style="cursor:pointer">报告预览</span>
                                <span v-on:click="historyClick" style="cursor:pointer">历史对比</span>
                            </div>
                        </div>
                        <div class="checkinfo-card">
                            <div class="title">基本信息</div>
                            <div class="checkinfo-baseinfo">
                                <ul>
                                    <li>
                                        <span>检查类别：</span>
                                        <span>{{selectedItem.TypeName}}</span>
                                    </li>
                                    <li>
                                        <span>检查日期：</span>
                                        <span>{{selectedItem.ObservationBeginDateTime|dateFormat}}</span>
                                    </li>
                                    <li>
                                        <span>申请单号：</span>
                                        <span v-on:click="applyClick(selectedItem.ApplyId)"
                                              style="cursor:pointer; color:#0000cc">{{selectedItem.ApplyId}}</span>
                                    </li>
                                    <li>
                                        <span>报告日期：</span>
                                        <span>{{ModifyConfig.DateToDate(selectedItem.ReportedDateTime)|dateFormat}}</span>
                                    </li>
                                    <li>
                                        <span>申请日期：</span>
                                        <span>{{ModifyConfig.DateToDate(selectedItem.RequestedDateTime)|dateFormat}}</span>
                                    </li>

                                    <li>
                                        <span>报告人员：</span>
                                        <span>{{selectedItem.PatientName}}</span>
                                    </li>
                                    <li>
                                        <span>申请医生：</span>
                                        <span>{{selectedItem.ApplyDoctor}}</span>
                                    </li>
                                    <li>
                                        <span>审核人员：</span>
                                        <span>{{selectedItem.AssessorName}}</span>
                                    </li>
                                    <li>
                                        <span>申请科室：</span>
                                        <span>{{selectedItem.ExecDeptName}}</span>
                                    </li>
                                </ul>
                                <div class="clear"></div>
                            </div>
                            <div class="title">检查项目</div>
                            <div class="checkinfo-text">{{selectedItem.RequestItemName}}</div>
                            <div class="title">检查部位</div>
                            <div class="checkinfo-text">{{selectedItem.ObsSiteName}}</div>
                            <div class="title">检查结论</div>
                            <div class="checkinfo-text">{{selectedItem.OBSDiagText}}</div>
                            <div class="title">检查所见</div>
                            <div class="checkinfo-text">{{selectedItem.Findings}}</div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="clear"></div>
        </div>
    </div>

    <el-dialog title="历史对比" :visible.sync="history.show" width="60%">
        <el-table :data="history.Data" height="300">
            <el-table-column type="index" label="序号" width="50"></el-table-column>
            <el-table-column property="RequestItemName" label="项目名称" width="150"></el-table-column>

            <el-table-column label="检查时间" width="150">
                <template slot-scope="scope">
                    {{ModifyConfig.DateToDate(scope.row.ReportedDateTime)}}
                </template>
            </el-table-column>

            <el-table-column property="ObsSiteName" label="检查部位" width="150"
                             :show-overflow-tooltip="true"></el-table-column>
            <el-table-column property="OBSDiagText" label="检查结论" width="150"
                             :show-overflow-tooltip="true"></el-table-column>
            <el-table-column property="Findings" label="检查所见" width="200"
                             :show-overflow-tooltip="true"></el-table-column>
            <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button v-on:click="jumpVideo" type="text">影像预览</el-button>
                </template>
            </el-table-column>

        </el-table>
    </el-dialog>
    <el-dialog :visible.sync="applyVisible" title="检查申请单">
        <iframe :src="appUrl" style="width:100%;height:300px; margin:0px; padding:0px; border:none; " frameborder="0"
                scrolling="auto"></iframe>
    </el-dialog>

    <el-dialog :visible.sync="showjumpVideo" title="影像预览">
        <iframe :src="jumpVideoUrl" style="width:100%;height:400px; margin:0px; padding:0px; border:none; "
                frameborder="0" scrolling="auto"></iframe>
    </el-dialog>

</div>
</body>

<script type="text/javascript">
    var app = new Vue({
        el: "#app",
        data() {
            return {
                applyVisible: false,
                showjumpVideo: false,
                inspectReportData: [],
                InspectionItemDetailAll: [],
                selectedItem: {},
                requestModel: {dates: [], outpatientDepartment: true, hospitalization: true},
                defaultProps: {
                    children: 'children',
                    label: 'label'
                },
                history: {
                    show: false,
                    Data: []
                },
                loading: false,
                isNotData: true,
                collapseValue: [0],
                appUrl: '',
                jumpVideoUrl: ''
            };
        },
        methods: {
            applyClick(id) {
                this.applyVisible = true;
                this.appUrl = '/CDR/InspectReport/Apply/?applyId=' + id + '&patientId=' + clinBrain.getParam("patientId") + '&visitNumber=' + clinBrain.getParam("visitNumber") + '&oporIp=' + clinBrain.getParam("oporIp");
            },
            detailClick(item) {
                this.selectedItem = item;
                if (this.selectedItem.RequestItemName == null || this.selectedItem.RequestItemName == undefined)
                    this.selectedItem.RequestItemName = "";
                if (this.selectedItem.ObsSiteName == null || this.selectedItem.ObsSiteName == undefined)
                    this.selectedItem.ObsSiteName = "";
                if (this.selectedItem.OBSDiagText == null || this.selectedItem.OBSDiagText == undefined)
                    this.selectedItem.OBSDiagText = "";
                if (this.selectedItem.Findings == null || this.selectedItem.Findings == undefined)
                    this.selectedItem.Findings = "";
                this.selectedItem.RequestItemName = this.selectedItem.RequestItemName.replace(/\\r\\n/g, '').replace(/\\n/g, '').replace(/\\r/g, '').replace(/\\t/g, '');
                this.selectedItem.ObsSiteName = this.selectedItem.ObsSiteName.replace(/\\r\\n/g, '').replace(/\\n/g, '').replace(/\\r/g, '').replace(/\\t/g, '');
                this.selectedItem.OBSDiagText = this.selectedItem.OBSDiagText.replace(/\\r\\n/g, '').replace(/\\n/g, '').replace(/\\r/g, '').replace(/\\t/g, '');
                this.selectedItem.Findings = this.selectedItem.Findings.replace(/\\r\\n/g, '').replace(/\\n/g, '').replace(/\\r/g, '').replace(/\\t/g, '');
            },
            jumpVideo() {
                this.selectedItem.opOrIpInt = this.selectedItem.OPorIP == 'IP' ? 1 : 2
                if (!this.selectedItem.patientId) {
                    if (this.selectedItem.Str5) {
                        this.selectedItem.patientId = this.selectedItem.Str5;
                    } else {
                        this.selectedItem.patientId = clinBrain.getParam("patientId");
                    }
                }
                var url = ModifyConfig.GetUrl(this.selectedItem);
                if (url) {
                    window.open(url);
                } else {
                    this.$message({
                        message: '抱歉,暂时不支持查看当前类型的影像报告！',
                        type: 'warning'
                    });
                }
            },
            getOs() {
                var sUserAgent = navigator.userAgent;
                var isWin = (navigator.platform == "Win32") || (navigator.platform == "Windows");
                var isMac = (navigator.platform == "Mac68K") || (navigator.platform == "MacPPC") || (navigator.platform == "Macintosh") || (navigator.platform == "MacIntel");
                if (isMac) return "Mac";
                var isUnix = (navigator.platform == "X11") && !isWin && !isMac;
                if (isUnix) return "Unix";
                var isLinux = (String(navigator.platform).indexOf("Linux") > -1);
                if (isLinux) return "Linux";
                if (isWin) {
                    var isWin2K = sUserAgent.indexOf("Windows NT 5.0") > -1 || sUserAgent.indexOf("Windows 2000") > -1;
                    if (isWin2K) return "Win2000";
                    var isWinXP = sUserAgent.indexOf("Windows NT 5.1") > -1 || sUserAgent.indexOf("Windows XP") > -1;
                    if (isWinXP) return "WinXP";
                    var isWin2003 = sUserAgent.indexOf("Windows NT 5.2") > -1 || sUserAgent.indexOf("Windows 2003") > -1;
                    if (isWin2003) return "Win2003";
                    var isWinVista = sUserAgent.indexOf("Windows NT 6.0") > -1 || sUserAgent.indexOf("Windows Vista") > -1;
                    if (isWinVista) return "WinVista";
                    var isWin7 = sUserAgent.indexOf("Windows NT 6.1") > -1 || sUserAgent.indexOf("Windows 7") > -1;
                    if (isWin7) return "Win7";

                    var isWin8 = sUserAgent.indexOf("Windows NT 6.2") > -1 || sUserAgent.indexOf("Windows 8") > -1;
                    if (isWin8) return "Win8";
                    var isWin8_1 = sUserAgent.indexOf("Windows NT 6.3") > -1;
                    if (isWin8_1) return "Win8.1";
                    var isWin10 = sUserAgent.indexOf("Windows NT 6.4") > -1 || sUserAgent.indexOf("Windows NT 10") > -1;
                    if (isWin10) return "Win10";
                }
                return "other";
            },
            historyClick() {
                app.history.Data = [];
                app.history.show = true;
                if (app.inspectReportData.length == 0)
                    return;
                clinBrain.request({
                    url: "/cdr/inspectreport/getdata/",
                    params: {
                        PatientID: clinBrain.getParam("patientId"),
                        OporIpVn: clinBrain.getParam("visitNumber"),
                        OporIp: clinBrain.getParam("oporIp"),
                        MedicalType: [1, 2]
                    }
                }, this).success(function (resp) {
                    var data = resp.data.Data;
                    data.forEach(x => {
                        app.history.Data.push(x.InspectionItemDetail[0])
                    });
                });
            },
            getDate(index) {
                if (this.requestModel.dates && this.requestModel.dates.length >= index + 1) {
                    return this.requestModel.dates[index];
                }
                return null;
            },
            /**
             *查询数据
             */
            search() {
                var _this = this;
                var medicalTypes = [];
                if (this.requestModel.outpatientDepartment) {
                    medicalTypes.push(1);
                }
                if (this.requestModel.hospitalization) {
                    medicalTypes.push(2);
                }
                this.loading = true
                clinBrain.request({
                    url: "/pms/query",
                    params: {
                        code: "com.base.api.cdr.InspectReport",
                        params: {
                            StartDate: this.getDate(0),
                            EndDate: this.getDate(1),
                            patientId: clinBrain.getParam("patientId"),
                            visitNumber: clinBrain.getParam("visitNumber"),
                            opOrIp: clinBrain.getParam("oporIp"),
                            MedicalType: medicalTypes
                        }
                    }
                }, this).success(function (resp) {
                    _this.loading = false;
                    _this.inspectReportData = resp.data.Data;
                    _this.InspectionItemDetailAll = [];
                    for (var i = 0; i < _this.inspectReportData.length; i++) {
                        var item = _this.inspectReportData[i];
                        for (var j = 0; j < item.InspectionItemDetail.length; j++) {
                            _this.InspectionItemDetailAll.push(item.InspectionItemDetail[j]);
                        }
                    }

                    if (_this.inspectReportData && _this.inspectReportData.length > 0 && _this.inspectReportData[0].InspectionItemDetail && _this.inspectReportData[0].InspectionItemDetail.length > 0) {
                        _this.selectedItem = _this.inspectReportData[0].InspectionItemDetail[0]

                        _this.detailClick(_this.selectedItem);
                    } else {
                        _this.selectedItem = {};
                    }

                    _this.isNotData = !resp.data.Data || resp.data.Data.length == 0;
                });
            }
        },
        created: function () {
            this.search();
        },
        filters: {
            dateFormat(val) {
                if (val) {
                    return new Date(val).format('yyyy-MM-dd hh:mm:ss');
                } else {
                    return '--'
                }
            },
            GetTitle(item) {
                var oporip = item.OPorIP == "IP" ? '住院' : '门诊';
                return ModifyConfig.DateToDate(item.VisitDate) + '-' + item.RequestItemName + '-' + oporip;
            }
        }
    });
</script>
<script type="text/javascript">
    var watermsg = HospitalConfig.FullName + '：' + '@ViewBag.UserId';
    $(function () {
        setTimeout(function () {
            if (HospitalConfig.IsBLSY)
                waterMark$($("#rightDiv"), watermsg);
        }, 500);

    });
    window.onresize = function () {
        if (HospitalConfig.IsBLSY)
            waterMark$($("#rightDiv"), watermsg);
    }
</script>
</html>


